<template>
	<view class="search-box flex_cc">
		<view class="input-box flex_fsc">
			<uni-icons type="search" size="18"></uni-icons>
			<input type="text" placeholder="请输入问题关键词" placeholder-class="uni-placeholder" class="uni-ml-16 width-100"/>
		</view>
	</view>
	<view class="question-item flex_fs">
		<image :src="setting.oss_pub_domain + '/app-img/my/pc.png'" class="user-head"></image>
		<view>
			<view>劈击球技术分析及练习,当球被打到果岭之后，要用那种球杆打球?</view>
			<view class="flex_sbc">
				<view>一号木：打不远</view>
				<view class="button uni-extra-color-bg">已解答</view>
			</view>
		</view>
	</view>
	<view class="question-item flex_fs">
		<image :src="setting.oss_pub_domain + '/app-img/my/pc.png'" class="user-head"></image>
		<view>
			<view>劈击球技术分析及练习,当球被打到果岭之后，要用那种球杆打球?</view>
			<view class="flex_sbc">
				<view>一号木：打不远</view>
				<view class="button uni-color-main-bg">待解答</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { onShow } from '@dcloudio/uni-app'
	import { ref, reactive, getCurrentInstance } from 'vue';
	const { proxy: that } = getCurrentInstance()
	
</script>

<style lang="scss">
	page {
		background: $uni-F5F5F5;
	}
	
	.search-box {
		width: 100vw;
		height: 88rpx;
		background: $uni-white;
		.input-box {
			width: 702rpx;
			height: 64rpx;
			background: $uni-F5F5F5;
			border-radius: 16rpx;
			box-sizing: border-box;
			padding: 0 24rpx;
		}
	}
	
	.question-item {
		width: 686rpx;
		box-sizing: border-box;
		padding: 32rpx;
		background: $uni-white;
		margin: 24rpx 32rpx 0;
		border-radius: 24rpx;
		.user-head {
			width: 88rpx;
			height: 88rpx;
			border-radius: 44rpx;
			flex-shrink: 0;
			margin-right: 24rpx;
		}
		.button {
			width: 104rpx;
			height: 56rpx;
			line-height: 56rpx;
			text-align: center;
			color: $uni-white;
			border-radius: 16rpx;
			font-size: 24rpx;
		}
	}
</style>
